<template>
    <div id="app">
      <div class="login-box">
        <div class="title">密码登陆</div>
        <div class="line">
          <!-- v-model 将表单的值绑定到一个变量 -->
          <input type="text" v-model="username" placeholder="手机号" />
        </div>
        <div class="line">
          <input type="password" v-model="userpass" placeholder="密码" />
        </div>
  
        <div class="zhuyi">
          <van-checkbox v-model="checked" shape="square"
            >我已阅读并同意
            <span style="color: blue">《boss用户服务协议》、《隐 私政策》</span>
            ，并授权boss账号信息以便统-管理
          </van-checkbox>
        </div>
  
        <div class="line">
          <input type="button" @click="login" value="登陆" />
        </div>
        <router-link to="/regist">还没有账号，去注册</router-link>
      </div>
    </div>
  </template>
  
  
  <script>
  // import axios from "axios";
  export default {
    name: "App",
    data() {
      return {
        username: "",
        userpass: "",
        checked: true,
      };
    },
    methods: {
       login () {
                  if(window.localStorage){
                      var storage = window.localStorage 
                      
                      if(this.user == storage.getItem('username')){
                          alert('登陆成功!')
                          this.$store.commit('hiddenMenu')
                          this.$router.push({
                              path:'/'
                          })
                      }else{
                      alert('用户名未注册，请先去注册')
                      }
                  }
              },
              toReg(){
                  this.$router.push({
                      path:'/register'
                  })
              }
  
  
    },
    mounted() {
      //post类型的请求, 请求参数必须 以 { id:100, name:'张三' } 这样的格式书写
    },
  };
  </script>
  
  <style lang="scss">
  * {
    margin: 0;
    padding: 0;
  }
  .login-box {
    margin: 50px 20px;
  }
  .login-box .title {
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 50px;
  }
  .login-box .line {
    margin-bottom: 20px;
  }
  .login-box .line input {
    height: 40px;
    width: 100%;
    border: 1px solid #ccc;
    outline: none;
    padding-left: 20px;
    border-radius: 20px;
    box-sizing: border-box;
  }
  
   .zhuyi{
    font-size: 12px;
    margin: 40px 0 20px 10px;
  }
  </style>
  